
<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>手机登录</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui-flex.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui-slide.css" />
    <link rel="stylesheet" type="text/css" href="../css/index.css" />
    <link rel="stylesheet" type="text/css" href="../css/common.css" />
    <style type="text/css">
      body{-webkit-overflow-scrolling:touch;}
      html, body{overflow-x: hidden;padding: 0;margin: 0;}
      body{
        background: #ffffff;
      }
      .position_box{
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: url('../image/login/bg.png') no-repeat;
        background-size: contain;
        display: flex;
        flex-direction: column;
      }
      .login_logo{
        margin-top: 5.6rem;
      }
      .login_logo img{
        width: 9.3rem;
        margin: 0 auto;
      }
      .login_btn{
        margin-top: 16.6rem;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
      }
      .login_btn>div:nth-of-type(1){
        width: 13.3rem;
        height: 2.28rem;
        border-radius: 1.14rem;
        background: #fe4aa0;
        text-align: center;
        font-size: 0.85rem;
        color: #fff;
        letter-spacing: 2px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 0.66rem;
      }
      .login_btn>div:nth-of-type(1)>img{
        width: 0.8rem;
        display: inline-block;
        margin-right: 0.64rem;
      }
      .login_btn>p{
        font-size: .59rem;
        color: #666;
        margin-bottom: 0.64rem;
        text-align: center;
      }
      .login_btn>p>span{
        color: #FE4AA0;
      }
      .login_btn>div:nth-of-type(2){
        font-size: 0.59rem;
        color: #666;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 0.66rem;
      }
      .login_btn>div:nth-of-type(2)>img{
        width: 0.53rem;
        margin-right: 0.4rem;
      }
    </style>
</head>
<body>
  <div class="aui-content">
    <div class="position_box">
      <div class="login_logo">
        <img src="../image/login/logo.png" />
      </div>
      <div class="login_btn phone_box">
        <div><img src="../image/login/phone.png" />手机登录</div>
        <p>登录注册即表示同意<span>《用户隐私协议》</span></p>
      </div>
      </div>
  </div>
</body>
<script type="text/javascript" src="./script/api.js"></script>
<script type="text/javascript" src="./script/zepto.min.js"></script>
<script type="text/javascript" src="./script/common.js"></script>
<script type="text/javascript">
    apiready = function(){
      api.parseTapmode();
    }
    //提交
    function Submit(){
      var mobile = $api.byId('mobile').value;
      var smscode = $api.byId('smscode').value;
      var invitecode = $api.byId('invite_code').value;
      if (!window.regex_mobile.test(mobile)) {
        _toast('请输入正确的手机号');
        return false;
      }
      if (smscode<=0) {
        _toast('请输入验证码');
        return false;
      }
      var invite_code = '';
      if (invitecode!=='') {
          invite_code = invitecode;
      }
      var device_model = api.deviceModel;
      var device_id = api.deviceId;
      _loading('登录中...','',true);
      _Ajax(window.APIServer.SmsLogin,'post',{values:{mobile:mobile,smscode:smscode,invite_code:invite_code,device_model:device_model,device_id:device_id}},'json',function(ret){
          _loading_close();
          if (ret.code==1) {
              var uinfo = ret.data;
              //存储用户信息
              _SetPrefs('token', uinfo.token);
              _SetPrefs('uid', uinfo.uid);
              _SetPrefs('uinfo', uinfo);
              //广播事件：用户登录成功
              _SendEvent('UserLogin', uinfo.uid);
              _toast('登录成功！');
              setTimeout(function() {
                   api.closeToWin({
                       name : 'root'
                   });
              }, 500)
          }else{
              _toast(ret.msg);
          }

      });
    }
    //获取验证码
    function SendSms(){
      var mobile = $api.byId('mobile').value;
      if (!window.regex_mobile.test(mobile)) {
        _toast('请输入正确的手机号');
        return false;
      }
      _Ajax(window.APIServer.SendSms,'post',{values:{mobile:mobile}},'json',function(ret){
        _toast(ret.msg);
        showtime(60);
      });

    }
    //.计时器
    function showtime(t) {
      for ( i = 1; i <= t; i++)
      {
        window.setTimeout("update(" + i + "," + t + ")", i * 1000);
      }
    }
    function update(num, t) {
      if (num == t) {
        $api.addCls( $api.dom( '.codebtn2' ), 'hide' );
        $api.removeCls( $api.dom( '.codebtn1' ), 'hide' );
        $api.text($api.byId("getcode"), '重新获取');
      }
      else
      {
        printnr = t - num;
        $api.addCls( $api.dom( '.codebtn1' ), 'hide' );
        $api.removeCls( $api.dom( '.codebtn2' ), 'hide' );
        $api.text($api.byId("codejqs"), '('+printnr + " 's)");
      }
    }
</script>
</html>
